<!DOCTYPE html>
<html class="x-admin-sm">
    <head>
        <meta charset="UTF-8">
        <title>用户管理</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <link rel="stylesheet" href="/oauthplatform/static/css/x-admin/font.css">
        <link rel="stylesheet" href="/oauthplatform/static/css/x-admin/xadmin.css">
        <link rel="stylesheet" href="/oauthplatform/static/lib/zTree/css/zTreeStyle/zTreeStyle.css">
    </head>

    <body>
        <div class="x-nav">
            <span class="layui-breadcrumb">
                <a>首页</a>
                <a><cite>用户管理</cite></a>
            </span>
            <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
                <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
            </a>
        </div>

        <div class="layui-fluid layui-row layui-col-space15">
            <div class="layui-col-sm12 layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-header">详细信息</div>
                    <div class="layui-card-body ">
                        <form class="layui-form layui-col-space5" id="searchForm">
                            <div class="layui-inline layui-show-xs-block">
                                <select name="isValid" id="isValid">
                                    <option value="">是否启用</option>
                                    <option value="1">已启用</option>
                                    <option value="0">未启用</option>
                                </select>
                            </div>
                            <div class="layui-inline layui-show-xs-block">
                                <input type="text" name="userName" id="userName" placeholder="请输入用户名" class="layui-input">
                            </div>
                            <div class="layui-inline layui-show-xs-block">
                                <input type="text" name="nickName" id="nickName" placeholder="请输入昵称" class="layui-input">
                            </div>
                            <div class="layui-inline layui-show-xs-block">
                                <button class="layui-btn" type="button" onclick="reloadTable()"  title="搜索">
                                    <i class="layui-icon">&#xe615;</i>
                                </button>
                                <button type="button" class="layui-btn layui-btn-sm" title="添加" onclick="addUser()">
                                    <i class="layui-icon">&#xe654;</i>
                                </button>
                            </div>
                        </form>
                    </div>

                    <div class="layui-card-body">
                        <div id="dataTables"></div>
                    </div>
                </div>
            </div>

        </div>
    </body>
    <script type="text/javascript" src="/oauthplatform/static/lib/jquery/jquery.3.4.1.js"></script>
    <script src="/oauthplatform/static/lib/layui/layui.js" charset="utf-8"></script>
    <script src="/oauthplatform/static/lib/other/html5.min.js"></script>
    <script src="/oauthplatform/static/lib/other/respond.min.js"></script>
    <script src="/oauthplatform/static/lib/zTree/js/jquery.ztree.core.js"></script>
    <script src="/oauthplatform/static/lib/x-admin/xadmin.js"></script>
    <script type="application/javascript">
        var table ;
        layui.use('table', function(){
            table = layui.table;
            //第一个实例
            table.render({
                elem: '#dataTables'
                ,url: '/oauthplatform/user/list' //数据接口
                ,parseData: function(res){ //res 即为原始返回的数据
                    return {
                        "code": 0, //解析接口状态
                        "msg": "", //解析提示文本
                        "count": res.total, //解析数据长度
                        "data": res.records //解析数据列表
                    };
                }
                ,page:{ //支持传入 laypage 组件的所有参数（某些参数除外,如：jump/elem） - 详见文档
                    layout: ['limit', 'count', 'prev', 'page', 'next'] //自定义分页布局
                    ,first: false //不显示首页
                    ,last: false //不显示尾页
                    ,groups : 5
                }
                ,cols: [[ //表头
                    {field: 'id', title: '序号', fixed: 'left'}
                    ,{field: 'userName', title: '用户名'}
                    ,{field: 'nickName', title: '昵称'}
                    ,{field: 'roleName', title: '角色名称'}
                    ,{field: 'phone', title: '电话'}
                    ,{field: 'isValid', title: '是否启用',templet: function(d){return d.is_valid == 0 ? '否' : '是'}}
                    ,{field: 'isValid', title: '操作',templet: function(d){
                            var buttonHtml = '';
                            buttonHtml += '<button type="button" class="layui-btn layui-btn-sm" title="详情" onclick="showDetail('+d.id+')">'+
                                    '<i class="layui-icon">&#xe60a;</i></button>';
                            buttonHtml += '<button type="button" class="layui-btn layui-btn-sm" title="修改" onclick="editUser('+d.id+')">'+
                                    '<i class="layui-icon">&#xe642;</i></button>';
                            buttonHtml += '<button type="button" class="layui-btn layui-btn-sm" title="删除" onclick="deleteUser('+d.id+')">'+
                                    '<i class="layui-icon">&#xe640;</i></button>';
                            buttonHtml += '<button type="button" class="layui-btn layui-btn-sm" title="授权" onclick="authorization('+d.id+')">'+
                                    '<i class="layui-icon">&#xe672;</i></button>';
                        return buttonHtml;
                    }}
                ]]
            });
        });

        //搜索
        function reloadTable(){
            table.reload('dataTables',{
                where:{userName : $("#userName").val(), isValid : $("#isValid").val(),nickName : $("#nickName").val()}
            });
        }

        function showDetail(id){
            if(id == null || id == ''){　layer.msg("参数异常,请联系管理员");　return false; }
            xadmin.open('详细信息','/oauthplatform/user/detail?id='+id,'','',true);
        }

        function addUser(){ xadmin.open('添加用户','/oauthplatform/user/add','','',true); }

        function editUser(id){
            if(id==null||id==''){ layer.msg("参数异常,请联系管理员"); return false; }
            xadmin.open('修改用户','/oauthplatform/user/edit?id='+id,'','',true);
        }

        function deleteUser(id){
            if(id==null||id==''){ layer.msg("参数异常,请联系管理员"); return false;　}
            $.ajax({
                type: "POST",//方法类型
                url: "/oauthplatform/user/delete" ,//url
                data: {id:id},
                success: function (result) {
                    layer.msg(result.msg);
                    if(parseInt(result.code) == 200){
                        setTimeout(function(){ location.reload(); }, 800);
                    }
                },
                error: function (result) { layer.msg("系统异常,请联系管理员"); }
            });
        }

        function authorization(id){
            if(id==null||id==''){ layer.msg("参数异常,请联系管理员"); return false; }
            xadmin.open('授权','/oauthplatform/awarded/index?id='+id,600,750,false);
        }
    </script>
</html>
